layui.use(['form', 'table', 'tree', 'iconPickerFa'], function () {
    var form = layui.form,
        layer = layui.layer,
        table = layui.table,
        tree = layui.tree,
        iconPickerFa = layui.iconPickerFa,
        $ = layui.$;

    /**
     * 初始化表单，要加上，不然刷新部分组件可能会不加载
     */
    form.render();

    // 当前弹出层，防止ID被覆盖
    var parentIndex = layer.index;

    //初始化
    $(function(){
        var id = $("#id").val();
        if(id != '' && id != null && id != undefined){
            var index = layer.load(2);
            var url = "/sys/menu/getInfoById";
            $.get(url, {id: id}, function(data){
                layer.close(index);
                if(data.state == "200"){
                    $("#iconPicker").val(data.icon.split(" ")[1]);
                    $("#iconPickerName").val(data.icon.split(" ")[1]);
                    $("#parentName").val(data.parentName);
                    $("#parentId").val(data.parentId);
                    $("#name").val(data.name);
                    $("#href").val(data.href);
                    $("#sort").val(data.sort);
                    for(var i = 0; i < $("input[name='type']").length; i++){
                        if(data.type == $($("input[name='type']")[i]).val()){
                            $($("input[name='type']")[i]).attr("checked", "checked");
                            break;
                        }
                    }
                    for(var i = 0; i < $("input[name='isShow']").length; i++){
                        if(data.isShow == $($("input[name='isShow']")[i]).val()){
                            $($("input[name='isShow']")[i]).attr("checked", "checked");
                            break;
                        }
                    }
                }else{
                    layer.msg(data.message, {icon:2});
                }
                form.render();
            })
        }
    });

    /**
     * 点击上级菜单
     */
    $("#parentName").on("click", function(){
        var index = layer.open({
            title: '上级菜单选择'
            ,area: ['280px', '500px']
            ,content: '<div id="parentTree">' +
                '<i class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop" style="font-size: 22px;"></i>' +
                '</div>'
        });

        //获取菜单树
        $.get('/sys/menu/getMenuTreeListTwo',{},function(res){
            if(res.state == "200"){
                var listStr = '[' + JSON.stringify(res.data) + ']';
                //渲染
                var parentTree = tree.render({
                    elem: '#parentTree'  //绑定元素
                    ,id: 'parentTreeId'
                    ,onlyIconControl: true //只能通过节点左侧图标来展开收缩
                    ,data: JSON.parse(listStr)
                    ,click: function(obj){
                        $("#parentName").val(obj.data.title);
                        $("#parentId").val(obj.data.id);
                        $("#parentIds").val(obj.data.id); //所有父级id编号
                        layer.close(index);
                    }
                });
            }else{
                layer.alert(res.message, {
                    icon: 2
                });
            }
        });

    });

    //图标选择器
    iconPickerFa.render({
        // 选择器，推荐使用input
        elem: '#iconPicker',
        // fa 图标接口
        url: "/layuimini/lib/font-awesome-4.7.0/less/variables.less",
        // 是否开启搜索：true/false，默认true
        search: true,
        // 是否开启分页：true/false，默认true
        page: true,
        // 每页显示数量，默认16
        limit: 16,
        // 点击回调
        click: function (data) {
            $("#iconPickerName").val(data.icon);
        },
        // 渲染成功后的回调
        success: function (d) {
            $("#iconPickerName").val(d.data[0]);
        }
    });

    //监听提交
    form.on('submit(saveBtn)', function (data) {
        var index = layer.load(2);
        var url = "/sys/menu/save";
        $.post(url, data.field, function(res){
            if(res.state == "200"){
                layer.msg(res.message, {icon:1});
            }else{
                layer.msg(res.message, {icon:2});
            }
            // 关闭弹出层
            layer.close(index);
            top.layer.close(parentIndex);
        }, 'json');

        return false;
    });

    $("#closeBtn").on("click", function(){
        // 关闭弹出层
        layer.close(parentIndex);
    });

});